<juci-layout-with-sidebar>
	<div ng-controller="PagePhoneNumberBlocking">
		<juci-config-heading>{{ 'Number Blocking' | translate }}</juci-config-heading>
		<juci-config-info>{{ 'phone.number_blocking.info' | translate }}</juci-config-info>
		
		<juci-config-section>
			<h2 translate>Outgoing Calls</h2>
			<juci-config-lines>
				<juci-config-line title="{{'Outgoing Number Blocking'|translate}}">
					<switch ng-model="filter.block_outgoing.value"></switch>
				</juci-config-line>
			</juci-config-lines>
			<juci-config-lines ng-show="filter.block_outgoing.value">
				<hr/>
				<juci-config-line title="Do not allow connections to these numbers">
					<div class="row form-group" ng-repeat="rule in outgoingRules track by rule['.name']">
						<div class="form-group form-inline">
							<div class="col-xs-10">
								<input type="text" class="form-control" ng-model="rule.extension.value" ng-blur="onSave()" placeholder="{{'Phone Extension'|translate}}"/>
							</div>
							<div class="col-xs-2">
								<button class="btn btn-default" ng-click="onDeleteOutgoingRule(rule)"><i class="fa fa-trash"></i></button>
							</div>
						</div>
					</div>
					<div class="row form-group form-inline">
						<button class="btn btn-default pull-right" ng-click="onAddOutgoingRule()"><i class="fa fa-plus"></i></button>
					</div>
				</juci-config-line>
				<hr/>
				<i translate>You can also block ranges of numbers.For example: "0160#" blocks all numbers starting with "0160".</i>
				<juci-config-line title="{{'Block connections to all foreign numbers'|translate}}">
					<switch ng-model="filter.block_foreign.value"></switch>
				</juci-config-line>
				<juci-config-line title="{{'Block connections to all special rate numbers'|translate}}">
					<switch ng-model="filter.block_special_rate.value"></switch>
				</juci-config-line>
			</juci-config-lines>
		</juci-config-section>
		<juci-config-section>
			<h2 translate>Incoming Calls</h2>
			<juci-config-lines>
				<juci-config-line title="{{'Incoming Number Blocking'|translate}}">
					<switch ng-model="filter.block_incoming.value"></switch>
				</juci-config-line>
			</juci-config-lines>
			<juci-config-lines ng-show="filter.block_incoming.value">
				<juci-config-line title="{{'Do not allow connections from these numbers'|translate}}">
					<div class="row" ng-repeat="rule in incomingRules">
						<div class="form-group form-inline">
							<input type="text" class="form-control" ng-model="rule.extension.value"  ng-blur="onSave()" placeholder="{{'Phone Extension'|translate}}"/>
							<button class="btn btn-default" ng-click="onDeleteIncomingRule(rule)"><i class="fa fa-trash"></i></button>
						</div>
					</div>
					<div class="row">
						<div class="form-group form-inline">
							<button class="btn btn-default pull-right" ng-click="onAddIncomingRule()"><i class="fa fa-plus"></i></button>
						</div>
					</div>
				</juci-config-line>
			</juci-config-lines>
		</juci-config-section>
		<juci-config-apply></juci-config-apply>
	</div>
</juci-layout-with-sidebar>
